<?php

/* @var $this \yii\web\View */
/* @var $content string */

use app\assets\AppAsset;

AppAsset::register($this);
$base = Yii::$app->request->baseUrl;
AppAsset::addCss($this, Yii::$app->request->baseUrl . "/css/home.css");
$this->title = $title;
if(!$share_id){
    $share_id=-1;
}
?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
    <title><?= $this->title ?></title>
</head>
<body>
<div style="background-color: white;width: 100%;height: 100%">
    <div style="width: auto;text-align: center;border-top: 1px #e0e0e0 solid;">
    </div>
    <?php for ($i = 0; $i < count($commodities); $i++) { ?>
        <div class="commodity-list" id="<?php echo $i ?>.list"
             onclick="clickCommodity(<?php echo $commodities[$i]['commodity_id'] ?>)">
            <div class="image-div">
                <img class="commodityList-image" hidden="true" id="<?php echo $i ?>"
                     src="<?php echo $commodities[$i]['pic_url'] ?>">
            </div>
            <div style="float: left;width: 50%;height: 130px;margin-left: 5.87%">
                <div class="commodityList-name">
                    <?php echo $commodities[$i]['commodity_name'] ?>
                </div>
                <div class="commodityList-price">
                    <span style="font-size: 18px">¥</span>
                    <span style="font-size: 18px"><?php echo substr($commodities[$i]['price'], 0, -2) ?></span>
                    <span style="font-size: 10px"><?php echo substr($commodities[$i]['price'], -2) ?></span>
                    <span
                        style="font-size: 14px; float: right;padding-right: 15px;position: relative;top: 3px;">销量: <?php echo $commodities[$i]['sales_num'] ?></span>
                </div>
                <div style="clear: both"></div>
            </div>


        </div>
    <?php } ?>
</div>
</body>
</html>

<script>
    $(document).ready(function(){
        function imageLoaded(){
            $(this).attr("hidden",false);
            var height = $(this).css('height');
            var width = $(this).css('width');
            if (parseInt(height.substring(0,height.length-2))>parseInt(width.substring(0,width.length-2))){
                $(this).css('height',"100%");
                $(this).width('auto');
            }else {
                $(this).css('width',"100%")
                $(this).height('auto');
            }
            var is_finalOne = $(this).attr('id');
            if (is_finalOne  == parseInt(<?=count($commodities)?>)-1)
                $(this).parent().parent().css('border-bottom','1px #e0e0e0 solid')
        }
        $(".commodityList-image").each(function(){
            if(this.complete){
                imageLoaded.call(this);
            }else{
                $(this).one('load', imageLoaded);
            }
        })
    })
    function clickCommodity(commodity_id){
        location.href = "../commodity-detail/detail?commodity_id=" + commodity_id+"&share_id="+<?php echo $share_id?>;
    }
</script>
